import React, { useEffect, useState } from 'react'
import { useParams } from 'react-router-dom'
import { getDetails } from '../../api'
import { Button, Space } from 'antd-mobile'
import { useNavigate } from 'react-router-dom'
function Details() {
  const navigate = useNavigate()
  const { id } = useParams()
  const [details, setDetails] = useState<any[]>([])
  useEffect(() => {
    getDetails(id).then((res) => {
      console.log(res)
      setDetails(res.data.data)
    })
  }, [])
  const click = () => {
    navigate('/shop')
  }
  console.log(details)
  return (
    <div>
      <h1>Details</h1>
      <div>
        <div>
          <img src="https://picsum.photos/200/300" alt="" />
        </div>
        <div>"本次画展汇聚了众多国内外知名艺术家的经典作品，展示了不同风格的绘画艺术，让观众能够近距离领略艺术之美。"</div>
      </div>
      <div>50<Button color='warning' onClick={click} >购买</Button></div>
    </div>
  )
}

export default Details
